<template>
  <div class="wrapper">
    <head-page title="商 机" id="backstyle"></head-page>
    <div class="banner">
      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
        <van-swipe-item v-for="(item, index) in bannerList" :key="index">
          <img :src="getImgUrl(item)" alt="" />
        </van-swipe-item>
      </van-swipe>
      <div class="content bold-size">
        <div class="title  tac l-h">{{ info.businessTitle }}</div>
        <div
          class="richText"
          v-html="info.businessText"
          v-if="info.businessText"
        ></div>
        <div v-else class="p-20 tac">暂无数据</div>
      </div>
    </div>
  </div>
</template>
<script>
import { getSelectBusiness } from "@/api/index";
export default {
  data() {
    return {
      bannerList: [],
      info: {},
    };
  },
  watch: {},
  computed: {},
  created() {},
  mounted() {
    getSelectBusiness({
      id: this.$route.query.id,
    }).then((res) => {
      if (res.data.code == 200) {
        this.bannerList = this.splitImg(res.data.data.businessImage);
        this.info = res.data.data;
        this.info.businessText = this.dataHTML(res.data.data.businessText);
      }
    });
  },
  methods: {
    getImgUrl(img) {
      return this.montageImgUrl(img);
    },
  },
};
</script>
<style scoped>
.wrapper {
}
.my-swipe img,
.my-swipe {
  width: 100%;
  height: 1.68rem;
  position: sticky;
  top: 0.35rem;
  z-index: 999;
}
.banner {
  width: 100%;

}
.content {
  padding: 0.1rem;
  padding-top: 0;
}
</style>